/**
 * Created by Administrator on 2017/5/30.
 */
$(document).ready(function () {
    var $books = $('#books');
    var $controls = $('<div id="books-controls"></div>').insertAfter($books);
    $('<button>Pause</button>').click(function (e) {
        e.preventDefault();
        var $paused = $('ul:paused');
        if ($paused.length) {
            $paused.cycle('resume');
        } else {
            $(this).effect('shake', {distance: 10});
        }
    }).button({
        icons: {primary: 'ui-icon-pause'}
    }).appendTo($controls);
    $('<button>Resume</button>').click(function (e) {
        e.preventDefault();
    }).button({
        icons: {primary: 'ui-icon-play'}
    }).appendTo($controls);

    $books.hover(function () {
        $books.find('.title').animate({
            backgroundColor: '#eee',
            color: '#000'
        }, 1000);
    }, function () {
        $books.find('.title').animate({
            backgroundColor: '#000',
            color: '#fff'
        }, 1000);
    });

    $books.find('.title').resizable();

    $('<div id="slider"></div>').slider({
        min: 0,
        max: $('#books li').length - 1,
        slide: function (e, ui) {
            $books.cycle(ui.value);
        }
    }).appendTo($controls);

    $('#books').cycle({
        timeout: 2000,
        speed: 200,
        pause: true,
        before: function () {
            $('#slider').slider('value', $('#books li').index(this));
        }
    });
});